<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="/static/css/base.css">
  <link rel="stylesheet" href="/static/css/index.css">
  <link rel="stylesheet" href="/static/css/goods.css">
</head>
<body>
  <div class="container header">
    商品列表
    <span>
      {{ if userInfo }}
      <div class="avatar">
        <img src="{{ userInfo.avatar }}">
        <p>{{ userInfo.nickname }}</p>
      </div>
      <ul class="options">
        <li><a href="/pages/info">个人中心</a></li>
        <li>注销登录</li>
      </ul>
      {{ else }}
      <a href="/pages/login">请登录</a>
      {{ /if }}
    </span>
  </div>

  <div></div>

  <div class="nav container">
    <a href="/pages/index">&lt;&lt; 返回首页</a>
    <a href="/pages/cart">
      <img class="" src="/public/images/004.webp" alt="" style="width: 60px; height: 60px;">
    </a>
  </div>

  <div class="container filterBox">
    <div class="box cate_box">
      <div class="left">分类: </div>
      <ul>
        <li class="cate active" data-cate="全部">全部</li>
        {{ each pagi.cates }}
        <li class="cate" data-cate="{{ $value }}">{{ $value }}</li>
        {{ /each }}
      </ul>
    </div>
    <div class="box sort_box">
      <div class="left">排序: </div>
      <ul>
        <li class="active sort" data-type="id" data-method="ASC">综合升序</li>
        <li class="sort" data-type="id" data-method="DESC">综合降序</li>
        <li class="sort" data-type="price" data-method="ASC">价格升序</li>
        <li class="sort" data-type="price" data-method="DESC">价格降序</li>
      </ul>
    </div>
    <div class="box search_box">
      <div class="left">搜索: </div>
      <input class="search_inp" type="text" placeholder="满300减40">
      <button>搜索</button>
    </div>
  </div>

  <ul class="goods_list">
    {{ each pagi.data }}
    <li class="goods_item" data-link="{{ $value.link }}">
      <div class="show">
        <img src="{{ $value.img }}" alt="">
      </div>
      <div class="info">
        <p class="desc">{{ $value.title }}</p>
        <p class="price">
          <span class="current">￥{{ $value.price }}</span>
        </p>
        <p class="btns">
          <button class="add" data-id="{{ $value._id }}">加入购物车</button>
          <button class="buy">立即购买</button>
        </p>
      </div>
    </li>
    {{ /each }}
  </ul>
  
  <div class="filter">
    <div id="pagination"></div>
  </div>

  <script src="/static/vander/jquery/jquery.min.js"></script>
  <script src="/static/js/pagination.js"></script>
  <script src="/static/js/goods.js"></script>
  
</body>
</html>
